{% extends "system_setup/base.html" %}

{% block page_link %}
    <script src="../../static/system_setup/js/linked_list.js"></script>
{% endblock %}


{% block style %}
    <style>
        .add_class {
            background: #1E90FF;
        }

        .li-class {
            list-style: none;
            margin-top: 2%;
            color: #0b0b0b;
            cursor: pointer;
        }

        .add_background {
            background: #A9A9A9;
        }

        .top_tag {
            border-bottom: #01AAED solid 2px;
            color: #01AAED;
        }

        .tab_top {
            width: 100px;
            height: 40px;
            line-height: 40px;
            text-align: center;
            display: inline-block;
            cursor: pointer;
        }

        tr {
            height: 35px;
        }

        th {
            text-align: center;
        }

        table {
            table-layout: fixed;
        }

        td:first-child, th:first-child {
            position: sticky;
            left: 0; /* 首行永远固定在左侧 */
            z-index: 1;
        }

        thead tr th {
            position: sticky;
            top: 0; /* 列首永远固定在头部  */
            background-color: #E8E8E8;
        }

        th:first-child {
            z-index: 2;
        }

        .search{
            width: 28%;
            display: flex;
            float: right;
            margin: 5.5px 0;
            margin-right: 0.5%;
            /*border: 1px solid red;*/
        }

        .search input{
            vertical-align:middle;
            float: left;//左浮动
            flex: 4;
            height: 29px;
            width: 55%;
            outline: none;
            border: 1px solid #0070c1;
            border-left: none;
            box-sizing: border-box;//盒子模型，怪异IE盒子模型，width=content+border*2+padding*2
            padding-left: 10px;
        }

        .search button{
            float: right;
            flex: 1;
            width: 20%;
            height: 29px;
            line-height: 29px;
            background-color: #0070c1;
            color: white;
            border-style: none;
            outline: none;
            border-bottom-right-radius: 5px;
            border-top-right-radius: 5px;
        }

        .search button i{
            font-style: normal;
        }

        .search button:hover{
            font-size: 16px;
        }

        .search1{
            width: 95%;
            display: flex;
            float: right;
            margin: 5.5px 0;
            margin-right: 1%;
            /*border: 1px solid red;*/
        }

        .search1 input{
            vertical-align:middle;
            float: left;//左浮动
            flex: 4;
            height: 29px;
            width: 77%;
            outline: none;
            border: 1px solid #0070c1;
            box-sizing: border-box;//盒子模型，怪异IE盒子模型，width=content+border*2+padding*2
            padding-left: 10px;
            border-bottom-left-radius: 5px;
            border-top-left-radius: 5px;
        }

        .search1 button{
            float: right;
            flex: 1;
            height: 29px;
            width: 23%;
            line-height: 29px;
            background-color: #0070c1;
            color: white;
            border-style: none;
            outline: none;
            border-bottom-right-radius: 5px;
            border-top-right-radius: 5px;
        }

        .search1 button i{
            font-style: normal;
        }

        .search1 button:hover{
            font-size: 16px;
        }

        .choose{
            float:left;
            cursor:pointer;
            width:25%;
            height: 29px;
            display:inline-block;
            position:relative;
            font-size:12px;
            text-align:center;
            padding-right:10px;
            z-index: 1000;
            line-height: 29px;
            border-bottom-left-radius: 5px;
            border-top-left-radius: 5px;
        }
        /*下拉箭头样式*/
        .choose b{
            position:absolute;
            right:8px;
            top:14px;
            width:0;
            height:0;
            border-width:4px 4px;
            border-style:solid;
            border-color:#868686 #fff #fff;
            font-size:0;line-height:0;
        }

        .choose:hover .choosePop{
            display:inline-block;
        }

        .choosePop{
            display:none;
            width:102%;
            position:absolute;
            left:-1px;
            top:20px;
        }

        .choose ul{
            border-bottom:1px solid #0070c1;
            list-style:none;
            width:100%;
            padding:0;
        }

        .choosePop ul li a:link,.choosePop ul li a:visited{
            color:#666;
            background:#fff;
        }
        /*鼠标移动到列表上效果*/
        .choosePop ul li a:hover,.choosePop ul li a:active{
            color:white;
            background:#0070c1;
        }

        .choosePop ul li{
            border-left:1px solid #0070c1;
            border-right:1px solid #0070c1;
            line-height:24px;
        }

        .choosePop ul li a{
            display:block;
            font-size:12px;
            text-decoration:none;
        }
        #mydiv {
            position: absolute;
            z-index: 9;
        }

        #mydivheader {
            padding: 10px;
            cursor: move;
        }
        .dragable {
            width: 200px;
            height: 200px;
            border: 1px solid darkorchid;
            position: relative;
        }
    </style>
{% endblock %}



{% block right_content %}
    <div style="width: 100%;height: 40px;background: white;border-bottom: #A9A9A9 solid 0.5px;">
        <div id="dispatch_detail_tab" onclick="change_mind('jurisdiction_list')" class="tab_top top_tag">
            权限列表
        </div>
        <div id="document_addressee_details_tab" onclick="change_mind('add_jurisdiction')" class="tab_top">
            添加权限
        </div>

        <div id="search_div" class="search">
            <div class="choose" style="border: #0c6fd9 1px solid;">
                <div id="chooseval" class="chooseList">全部</div>
                <b></b>
                <div class="choosePop">
                    <ul>
                        <li><a onclick="choose_val('全部')" href="#" value="全部">全部</a></li>
                        <li><a onclick="choose_val('菜单')" href="#" value="菜单">菜单</a></li>
                        <li><a onclick="choose_val('单据')" href="#" value="单据">单据</a></li>
                        <li><a onclick="choose_val('可执行人')" href="#" value="可执行人">可执行人</a></li>
                    </ul>
                </div>
            </div>
            <input type="text" placeholder="请输入..." name="" id="input_value" value="">
            <button onclick="search_jurisdiction()">搜索</button>
        </div>

        <div id="add_div" class="search" style="display: none">
            <input onclick="model_chuxian()" type="button" style="width: 100px;border: #0c6fd9 solid 1px;float: right;margin-right: 0.5%;border-radius: 3px;background: #0c6fd9;color: white;" value="添加">
        </div>
    </div>


    <div id="new_models" style="width: 80%;height: 80%;position: absolute;display: none;">
        <div id="box" style="width: 700px;height: 500px;background: white;z-index: 10100;position: absolute;top: 50%;left: 50%;transform:translate(-50%,-50%);border-radius: 3px;">
            <div style="width: 100%;height: 50px;background: #f4f7fa;cursor: move;border-top-left-radius: 5px;border-top-right-radius: 5px;">
                <h5 id="modal-title" class="modal-title" style="line-height: 50px;width: 10%;margin-left: 1%;display: inline-block;"></h5>
                <span onclick="close_models()" style="float: right;line-height: 50px;padding-right: 2%;cursor: pointer;"><i class="iconfont icon-quchu"></i></span>
            </div>
            <hr>
            <div style="height: 400px;width: 100%;padding-top: 2%;padding-left: 2%;">
                <div>
                    <label><span style="color: red;">* </span>菜&nbsp;&nbsp;&nbsp;&nbsp;单</label>
                    <input id="caidan" type="text" placeholder="请填写权限菜单名，如：内部发文" style="width: 400px;border-radius: 3px;border: #dfdfdf solid 1px;height: 35px;" onfocus="add_color(this.id)" onblur="del_color(this.id)">
                </div>
                <div style="margin-top: 2%;">
                    <label><span style="color: red;">* </span>单&nbsp;&nbsp;&nbsp;&nbsp;据</label>
                    <input id="danju" type="text" placeholder="请填写权限单据，如：行政" style="width: 400px;border-radius: 3px;border: #dfdfdf solid 1px;height: 35px;" onfocus="add_color(this.id)" onblur="del_color(this.id)">
                </div>

                <div style="margin-top: 2%;">
                    <label><span style="color: red;">* </span>权限组</label>
                    <span><input name="A" type="radio"> A</span><span style="margin-left: 3%;"><input name="B" type="radio"> B</span><span style="margin-left: 3%;"><input name="C" type="radio"> C</span>
                    <span style="margin-left: 3%;"><input name="D" type="radio"> D</span><span style="margin-left: 3%;"><input name="E" type="radio"> E</span><span style="margin-left: 3%;"><input name="F" type="radio"> F</span>
                </div>

                <div style="margin-top: 2%;">
                    <label><span style="color: red;visibility: hidden;">* </span>执行人</label>
                    <input onclick="fill_val(this, ele_id=this.id, types=true)" id="zhixingren" type="text" placeholder="请填写执行人" style="width: 400px;border-radius: 3px;border: #dfdfdf solid 1px;height: 35px;" data-toggle="modal" data-target=".bd-example-modal-xl">
                </div>
            </div>
            <hr>
            <div style="width: 100%;height: 50px;text-align: right;padding-right: 2%;">
                <button id="add_big_limits_model" onclick="add_big_limits_model()" style="width: 100px;height: 36px;border: #dfdfdf solid 1px;margin-top: 7px;border-radius: 3px;">确认</button>
            </div>
        </div>
    </div>

    <div id="jurisdiction_list" style="width: 100%;height: 94%;">
        <div class="right-box" style="width: 100%;height: 95%;">
            <div style="height: 93%;width: 100%;overflow: auto;">
                <table class="table table-hover table-bordered"
                       style="border-collapse: collapse;width: 100%;table-layout:fixed;">
                    <thead>
                    <tr>
                        <th scope="col" style="width: 3%;">序号</th>
                        <th scope="col" style="width: 6%;">菜单</th>
                        <th scope="col" style="width: 10%;">单据</th>
                        <th scope="col" style="width: 9%;">权限组</th>
                        <th scope="col" style="width: 12%;">可执行人</th>
                        <th scope="col" style="width: 8%;">操作</th>
                    </tr>
                    </thead>
                    <tbody style="overflow: auto;" id="t_table"></tbody>
                </table>
                <div id="img-display" style="width: 75%;text-align: center;position: fixed;display: none;">
                    <div style="margin-top: 10%;">
                        <img src="../../static/public_file/images/page-img/11.jpg" alt="">
                        <p style="margin: 0;padding: 0;vertical-align: top;">暂无数据</p>
                    </div>
                </div>
            </div>
            <div id="pagination" class="pagination" style="margin-left: 20px;margin-top: 1.5%;"></div>
        </div>
    </div>

    <div id="add_jurisdiction" style="width: 100%;height: 94%;display: none;">
        <div class="right-box" style="width: 100%;height: 95%;">
            <div style="height: 93%;width: 100%;overflow: auto;">
                <table class="table table-hover table-bordered"
                       style="border-collapse: collapse;width: 100%;table-layout:fixed;">
                    <thead>
                    <tr>
                        <th scope="col" style="width: 70%;text-align: left;padding-left: 1%;">名称</th>
                        <th scope="col" style="width: 10%;">排序号</th>
                        <th scope="col" style="width: 10%;">状态</th>
                        <th scope="col" style="width: 10%;">操作</th>
                    </tr>
                    </thead>
                    <tbody style="overflow: auto;" id="t_table1">
                    </tbody>
                </table>
            </div>
            <div id="pagination" class="pagination" style="margin-left: 20px;margin-top: 1.5%;"></div>
        </div>
    </div>

    <div style="z-index: 11000" class="modal fade bd-example-modal-xl" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-xl" style="margin-top: 3%;">
            <div class="modal-content"
                 style="height: 600px;border-radius: 7px;width: 900px;margin-left: 15%;background: #F8F8FF;">
                <div class="modal-header" style="height: 50px;">
                    <h5 id="model_title" class="modal-title" style="line-height: 50px;width: 10%;margin-left: 2%;"></h5>
                    <button id="close-model" type="button" class="close" data-dismiss="modal" aria-label="Close"
                            style="margin-right: 3%;line-height: 50px;">
                        <span aria-hidden="true" style="font-size: 28px;"><i class="iconfont icon-quchu"></i></span>
                    </button>
                </div>
                <div class="modal-body" style="height: 200px;padding: 1%;">
                    <div style="display: inline-block;width: 30%;height: 100%;border-right: #E8E8E8 solid 1px;">
                        <div style="width: 100%;height: 35px;color: #0b0b0b;text-align: center;">
                            <div class="search1" style="vertical-align: center;">
                                <input type="text" placeholder="请输入..." name="" id="search_data" value="">
                                <button id="search_button">搜索</button>
                            </div>
                        </div>
                        <div style="width: 100%;height: 35px;line-height: 35px;padding-left: 2%;color: #0b0b0b;border-bottom: #cfcfcf solid 1px;">
                            <div id="an_branch"
                                 style="width: 31.5%;display: inline-block;cursor: pointer;text-align: center;color: #01aaed;">
                                按部门
                            </div>
                            <div id="an_rank"
                                 style="width: 31.5%;display: inline-block;cursor: pointer;text-align: center;">按权限
                            </div>
                            <div id="an_func"
                                 style="width: 31.5%;display: inline-block;cursor: pointer;text-align: center;">按职能
                            </div>
                        </div>
                        <div id="department_list" style="width: 100%;height: 85%;overflow: auto;">
                            <div style="width: 100%;height: 100%;text-align: center;">
                                <img style="width: 30%;height: 30%;margin-top: 35%;" src="../../static/public_file/images/jiazai.gif" alt="">
                            </div>
                        </div>
                    </div>

                    <div style="display: inline-block;width: 69%;height: 100%;overflow: auto;vertical-align: top;left: 0;">
                        <table class="table table-hover table-bordered"
                               style="border-collapse: collapse;margin: 0;padding: 0;">
                            <thead>
                            <tr>
                                <th scope="col" style="width: 10%;">
                                    <input id="all_select_checkbox" type="checkbox">
                                </th>
                                <th scope="col" style="width: 20%;">序号</th>
                                <th scope="col" style="width: 35%;">姓名</th>
                                <th scope="col" style="width: 35%;">工号</th>
                            </tr>
                            </thead>
                            <tbody style="overflow: auto;" id="t_table2"></tbody>
                        </table>
                        <div id="img-display1" style="width: 75%;text-align: center;">
                            <div style="margin-top: 10%;">
                                <img src="../../static/public_file/images/page-img/11.jpg" alt="">
                                <p style="margin: 0;padding: 0;vertical-align: top;">暂无数据</p>
                            </div>
                        </div>
                    </div>

                    <div style="height: 30%;width: 100%;border-top: #E8E8E8 solid 1px;overflow: auto;display: none;">
                        <div id="checked-label" style="margin-top: 1%;margin-left: 3%;width: 90%;">

                        </div>
                    </div>

                </div>
                <div class="modal-footer" style="height: 50px;">
                    <button id="model-affirm" type="button" class="btn btn-primary"
                            style="margin-left: 2%;margin-right: 2%;border-radius: 3px;height: 35px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;提&nbsp;交&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    </button>
                </div>
            </div>
        </div>
    </div>
{% endblock %}


{% block script %}
    <script>
        function change_mind(ele_id) {
            if (ele_id === "jurisdiction_list") {
                document.getElementById("jurisdiction_list").style.display = "inline-block";
                document.getElementById("add_jurisdiction").style.display = "none";
                // document.getElementById("change_administrative").style.display = 'none';
                document.getElementById("dispatch_detail_tab").className = "tab_top top_tag";
                document.getElementById("document_addressee_details_tab").className = "tab_top";
                // document.getElementById("administrative_details_tab").className = "tab_top";
                document.getElementById("search_div").style.display = "block";
                document.getElementById("add_div").style.display = "none";
                // document.getElementById("adminis_manage").style.display = "none";
            } else if (ele_id === 'add_jurisdiction') {
                document.getElementById("add_jurisdiction").style.display = "inline-block";
                document.getElementById("jurisdiction_list").style.display = "none";
                // document.getElementById("change_administrative").style.display = 'none';
                document.getElementById("dispatch_detail_tab").className = "tab_top";
                document.getElementById("document_addressee_details_tab").className = "tab_top top_tag";
                // document.getElementById("administrative_details_tab").className = "tab_top";
                document.getElementById("search_div").style.display = "none";
                document.getElementById("add_div").style.display = "block";
                // document.getElementById("adminis_manage").style.display = "none";
            // } else {
            //     document.getElementById("add_jurisdiction").style.display = "none";
            //     document.getElementById("jurisdiction_list").style.display = "none";
            //     document.getElementById("change_administrative").style.display = 'inline-block';
            //     document.getElementById("dispatch_detail_tab").className = "tab_top";
            //     document.getElementById("document_addressee_details_tab").className = "tab_top";
            //     document.getElementById("administrative_details_tab").className = "tab_top top_tag";
            //     document.getElementById("search_div").style.display = "none";
            //     document.getElementById("add_div").style.display = "none";
            //     document.getElementById("adminis_manage").style.display = "block";
            }
        }

        initialize();

        function initialize(page = 1) {
            document.getElementById("loading").style.display = "inline-block";
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP
            xhr.open('get', "/personal-center/bill_group_view?page=" + String(page));
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
            xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
            xhr.send();
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        document.getElementById("loading").style.display = "none";
                        var JsonDate = JSON.parse(xhr.responseText);
                        create_table(JsonDate["count"], JsonDate["bill_groups"]);
                        create_table1(JsonDate["bill_groups"]);
                        pagenum(JsonDate["count"], page);
                    }
                }
            };
        }

        // 动态创建列表
        function create_table(count_num, json_data) {
            var t_table = document.getElementById("t_table");
            deltr();
            if (json_data.length === 0) {
                document.getElementById("img-display").style.display = "inline-block";
            } else {
                document.getElementById("img-display").style.display = "none";
            }
            for (var i = 0; i < json_data.length; i++) {
                var tr = document.createElement("tr");
                var td = document.createElement("td");
                var td1 = document.createElement("td");
                var td2 = document.createElement("td");
                var td3 = document.createElement("td");
                var td4 = document.createElement("td");
                var td5 = document.createElement("td");
                var list_temp = json_data[i];
                var operator_str = "";
                var apply_user_list = json_data[i]["apply_user"].split(',');
                var job_numbers_list = json_data[i]["job_numbers"].split(',');
                if (apply_user_list.length && apply_user_list[0] !== ''){
                    for (var h=0; h<apply_user_list.length; h++){
                        operator_str += String(apply_user_list[h]).trim()+"("+String(job_numbers_list[h])+")"+", "
                    }
                }

                td.innerHTML = json_data[i]["menu"];td.style.textAlign = "center";
                td5.innerHTML = i+1;td5.style.textAlign = "center";
                td1.innerHTML = json_data[i]["bill"];td1.title = json_data[i]["bill"];td1.style.textAlign = "center";
                td2.innerHTML = json_data[i]["apply_user"];td2.title = json_data[i]["apply_user"];td2.style.textAlign = "center";td2.className = 'username';
                td3.innerHTML = json_data[i]["groups"];td3.title = json_data[i]["groups"];td3.style.textAlign = "center";
                {#td4.innerHTML = "<a onclick='fill_val(this" + ',ele_id=' +json_data[i]["id"] + ',types=false' + ',job_numbers=\"' + list_temp.job_numbers + "\")' href='#' data-toggle=\"modal\" data-target=\".bd-example-modal-xl1\">修改</a>";#}
                td4.innerHTML = "<a onclick='fill_val(this" + ',ele_id=' +json_data[i]["id"] + ',types=false' + ',job_numbers=\"' + operator_str.slice(0, -2) + "\")' href='#'>修改</a>";
                td4.style.textAlign = "center";
                tr.appendChild(td5);tr.appendChild(td);tr.appendChild(td1);tr.appendChild(td3);tr.appendChild(td2);tr.appendChild(td4);t_table.appendChild(tr);
            }
        }

        function model_chuxian() {
            document.getElementById("new_models").style.display="table";
        }
        
        function fill_val(obj, ele_id, types=false, job_numbers=false) {
            document.getElementById("new_models").style.display="table";
            var id = ele_id;
            sessionStorage.clear();
            document.getElementById("an_branch").style.color = "#01aaed";
            document.getElementById("an_rank").style.color = "#0b0b0b";
            document.getElementById("an_func").style.color = "#0b0b0b";
            document.getElementById("all_select_checkbox").checked = false;
            var check_box_list = document.getElementsByClassName("check_box");
            document.getElementById("search_button").setAttribute("onclick", "search_data()");
            document.getElementById("an_branch").setAttribute("onclick", "change_left_val(this.id)");
            document.getElementById("an_rank").setAttribute("onclick", "change_left_val(this.id)");
            document.getElementById("an_func").setAttribute("onclick", "change_left_val(this.id)");
            for (var t = 0; t < check_box_list.length; t++) {
                document.getElementById(check_box_list[t].id).checked = false;
            }
            document.getElementById("checked-label").innerHTML = "";

            if (types){
                document.getElementById("model-affirm").setAttribute("onclick", "summit_val1()");
                document.getElementById("model_title").innerText = "选择执行人";
            }else {
                document.getElementById("model-affirm").setAttribute("onclick", "summit_val('" + id + "')");
                document.getElementById("modal-title").innerText = "修改权限";
                var menu = $(obj).closest('tr').find('td').eq(1).text();
                var bill = $(obj).closest('tr').find('td').eq(2).text();
                var groups = $(obj).closest('tr').find('td').eq(3).text();
                padding_data1(menu, bill, groups, job_numbers);
                document.getElementById("add_big_limits_model").setAttribute("onclick", "add_big_limits_model(isadd=false,id=" + id + ")");
                {#console.log('menu', menu)#}
                {#console.log('bill', bill)#}
            }
            deltr1();
            document.getElementById("img-display1").style.display = "inline-block";
            if (window.branch_list) {
                var branch_list = window.branch_list;
                var department_list = document.getElementById("department_list");
                department_list.innerHTML = "";
                var ul_tag = document.createElement("ul");
                ul_tag.style.fontSize = "0";
                ul_tag.style.margin = "0";
                ul_tag.style.padding = "0";
                for (var i = 0; i < branch_list.length; i++) {
                    var li_tag = document.createElement("li");
                    li_tag.style.fontSize = "14px";
                    li_tag.style.margin = "0";
                    li_tag.style.padding = "0";
                    li_tag.innerHTML = "<p style='margin-left: 20%;'>" + branch_list[i] + "</p>";
                    li_tag.setAttribute("onclick", "choice_peopel('" + branch_list[i] + "')");
                    li_tag.setAttribute("id", branch_list[i]);
                    li_tag.className = "li-class";
                    ul_tag.appendChild(li_tag);
                    department_list.appendChild(ul_tag);
                }
            } else {
                var xhr = new XMLHttpRequest();
                var local_host = window.location.host;          // 获取当前IP
                xhr.open('post', "/technological/delegation", true);
                xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
                xhr.send();
                xhr.onreadystatechange = function () {
                    if (xhr.readyState === 4) {
                        if (xhr.status === 200) {
                            var JsonDate = JSON.parse(xhr.responseText);
                            window.personnel_list = JsonDate["data"];
                            window.emp_info_dict = JsonDate["emp_info_dict"];
                            window.people_dict = JsonDate["people_dict"];
                            window.people_dict_new = JsonDate["people_dict_new"];
                            window.branch_list = JsonDate["branch_list"];
                            window.function_list = JsonDate["function_list"];
                            var department_list = document.getElementById("department_list");
                            department_list.innerHTML = "";
                            var ul_tag = document.createElement("ul");
                            ul_tag.style.fontSize = "0";
                            ul_tag.style.margin = "0";
                            ul_tag.style.padding = "0";
                            for (var i = 0; i < JsonDate["branch_list"].length; i++) {
                                var li_tag = document.createElement("li");
                                li_tag.style.fontSize = "14px";
                                li_tag.style.margin = "0";
                                li_tag.style.padding = "0";
                                li_tag.innerHTML = "<p style='margin-left: 20%;'>" + JsonDate["branch_list"][i] + "</p>";
                                li_tag.setAttribute("onclick", "choice_peopel('" + JsonDate["branch_list"][i] + "')");
                                li_tag.setAttribute("id", JsonDate["branch_list"][i]);
                                li_tag.className = "li-class";
                                ul_tag.appendChild(li_tag);
                                department_list.appendChild(ul_tag);
                            }
                        }
                    }
                }
            }
        }

        function choice_peopel(choice_key, chose_id) {
            var data_str = sessionStorage.getItem(choice_key);
            var data_list = [];
            if (data_str) {
                data_list = data_str.split(",")
            }
            var emp_info_dict = window.emp_info_dict;
            document.getElementById("img-display1").style.display = "none";
            var t_table = document.getElementById("t_table2");
            if (document.getElementsByClassName("li-class add_background").length > 0) {
                var old_tag_id = document.getElementsByClassName("li-class add_background")[0].id;
                document.getElementById(old_tag_id).className = "li-class";
            }
            document.getElementById(choice_key).className = "li-class add_background";
            deltr1();
            document.getElementById("all_select_checkbox").checked = false;
            document.getElementById("all_select_checkbox").setAttribute("onclick", "check_all_select('" + choice_key + "', '" + chose_id + "')");

            for (var i = 0; i < emp_info_dict[choice_key].length; i++) {
                var elm = emp_info_dict[choice_key]
                var tr = document.createElement("tr");
                var td = document.createElement("td");
                var td1 = document.createElement("td");
                var td2 = document.createElement("td");
                var td3 = document.createElement("td");
                {#console.log('elm[i]', elm[i])#}
                td.innerHTML = "<input id='" + elm[i].real_name+"("+elm[i].job_number+')' + "' class='check_box' type=\"checkbox\" onclick='choice_consignor(this.id, \"" + chose_id + "\"" + ", \"" + choice_key + "\")'>";
                td.style.textAlign = "center";
                td1.innerHTML = i + 1;
                td1.style.textAlign = "center";
                td2.innerHTML = elm[i].real_name;
                td2.title = elm[i].real_name;
                td2.style.textAlign = "center";
                td3.innerHTML = elm[i].job_number;
                td3.title = elm[i].job_number;
                td3.style.textAlign = "center";
                tr.appendChild(td);
                tr.appendChild(td1);
                tr.appendChild(td2);
                tr.appendChild(td3);
                t_table.appendChild(tr);
            }

            var tttt = 0;
            if (data_list) {
                if (data_list[0] === "all") {
                    document.getElementById("all_select_checkbox").checked = true;
                    tttt = 1
                }
            }
            for (var III = tttt; III < data_list.length; III++) {
                document.getElementById(data_list[III].trim()).checked = true;
            }
        }

        // 创建右侧选择人员列表
        function choice_peopel_1(choice_key, chose_id) {
            var data_str = sessionStorage.getItem(choice_key);
            var data_list = [];
            if (data_str) {
                data_list = data_str.split(",")
            }
            var people_dict = window.people_dict;
            var people_dict_new = window.people_dict_new;
            document.getElementById("img-display1").style.display = "none";
            var t_table = document.getElementById("t_table2");
            if (document.getElementsByClassName("li-class add_background").length > 0) {
                var old_tag_id = document.getElementsByClassName("li-class add_background")[0].id;
                document.getElementById(old_tag_id).className = "li-class";
            }
            document.getElementById(choice_key).className = "li-class add_background";
            deltr1();
            document.getElementById("all_select_checkbox").checked = false;
            document.getElementById("all_select_checkbox").setAttribute("onclick", "check_all_select('" + choice_key + "', 'executor2')")
            for (var i = 0; i < people_dict_new[choice_key].length; i++) {
                var elm = people_dict_new[choice_key];
                var tr = document.createElement("tr");
                var td = document.createElement("td");
                var td1 = document.createElement("td");
                var td2 = document.createElement("td");
                var td3 = document.createElement("td");
                {#console.log('elm[i]', elm[i])#}
                td.innerHTML = "<input id='" + elm[i].real_name+'('+elm[i].job_number+')' + "' class='check_box' type=\"checkbox\" onclick='choice_consignor(this.id, \"" + chose_id + "\"" + ", \"" + choice_key + "\")'>";
                td.style.textAlign = "center";
                td1.innerHTML = i + 1;
                td1.style.textAlign = "center";
                td2.innerHTML = elm[i].real_name;
                td2.title = elm[i].real_name;
                td2.style.textAlign = "center";
                td3.innerHTML = elm[i].job_number;
                td3.title = elm[i].job_number;
                td3.style.textAlign = "center";
                tr.appendChild(td);
                tr.appendChild(td1);
                tr.appendChild(td2);
                tr.appendChild(td3);
                t_table.appendChild(tr);
            }
            var tttt = 0;
            if (data_list) {
                if (data_list[0] === "all") {
                    document.getElementById("all_select_checkbox").checked = true;
                    tttt = 1
                }
            }
            for (var III = tttt; III < data_list.length; III++) {
                document.getElementById(data_list[III].trim()).checked = true;
            }
        }

        // 创建右侧选择人员列表
        function choice_peopel_2(choice_key, chose_id) {
            var data_str = sessionStorage.getItem(choice_key);
            var data_list = [];
            if (data_str) {
                data_list = data_str.split(",")
            }

            var people_dict_new = window.function_list;
            document.getElementById("img-display1").style.display = "none";
            var t_table = document.getElementById("t_table2");
            if (document.getElementsByClassName("li-class add_background").length > 0) {
                var old_tag_id = document.getElementsByClassName("li-class add_background")[0].id;
                document.getElementById(old_tag_id).className = "li-class";
            }
            document.getElementById(choice_key).className = "li-class add_background";
            deltr1();
            document.getElementById("all_select_checkbox").checked = false;
            document.getElementById("all_select_checkbox").setAttribute("onclick", "check_all_select('" + choice_key + "', 'executor2')")
            for (var i = 0; i < people_dict_new[choice_key].length; i++) {
                var elm = people_dict_new[choice_key];
                var tr = document.createElement("tr");
                var td = document.createElement("td");
                var td1 = document.createElement("td");
                var td2 = document.createElement("td");
                var td3 = document.createElement("td");
                {#console.log('elm[i]', elm[i])#}
                td.innerHTML = "<input id='" + elm[i].real_name + '(' + elm[i].job_number + ')' + "' class='check_box' type=\"checkbox\" onclick='choice_consignor(this.id, \"" + chose_id + "\"" + ", \"" + choice_key + "\")'>";
                td.style.textAlign = "center";
                td1.innerHTML = i + 1;
                td1.style.textAlign = "center";
                td2.innerHTML = elm[i].real_name;
                td2.title = elm[i].real_name;
                td2.style.textAlign = "center";
                td3.innerHTML = elm[i].job_number;
                td3.title = elm[i].job_number;
                td3.style.textAlign = "center";
                tr.appendChild(td);
                tr.appendChild(td1);
                tr.appendChild(td2);
                tr.appendChild(td3);
                t_table.appendChild(tr);
            }
            var tttt = 0;
            if (data_list) {
                if (data_list[0] === "all") {
                    document.getElementById("all_select_checkbox").checked = true;
                    tttt = 1
                }
            }
            for (var III = tttt; III < data_list.length; III++) {
                document.getElementById(data_list[III].trim()).checked = true;
            }
        }

        function create_table1(json_data) {
            var t_table = document.getElementById("t_table1");
            var menu_name = "";
            var mwnu_num = 0;
            var menu_num = 1;
            for (var i = 0; i < json_data.length; i++) {
                var tr = document.createElement("tr");var td = document.createElement("td");var td1 = document.createElement("td");var td2 = document.createElement("td");var td3 = document.createElement("td");var td4 = document.createElement("td");
                if (json_data[i]["menu"] !== menu_name) {
                    menu_name = json_data[i]["menu"];
                    mwnu_num += 1;
                    menu_num = 1;
                    var tr_1 = document.createElement("tr");var td_1 = document.createElement("td");var td1_1 = document.createElement("td");var td2_1 = document.createElement("td");var td3_1 = document.createElement("td");
                    td_1.innerHTML = '<a href="#" onclick="menu_contraction(\'' + "0" + String(mwnu_num) + '\', \'' + "0" + String(mwnu_num) + '\')"><i id="' + "0" + String(mwnu_num) + '" class="iconfont icon-sanjiaoyou"></i> ' + menu_name + '</a>';td_1.style.paddingLeft = "1%";
                    td1_1.innerHTML = "0" + String(mwnu_num);td1_1.style.paddingLeft = "3.5%";
                    td2_1.innerHTML = "有效";td2_1.style.textAlign = "center";
                    td3_1.innerHTML = '<p onclick="padding_data(\''+json_data[i]["menu"]+'\')"><i  class="iconfont icon-zhucetianjiahaoyou"></i> 添加</p>';td3_1.style.textAlign = "center";td3_1.style.color = "#0c6fd9";td3_1.style.cursor = "pointer";
                    tr_1.appendChild(td_1);tr_1.appendChild(td1_1);tr_1.appendChild(td2_1);tr_1.appendChild(td3_1);
                    t_table.appendChild(tr_1);


                    tr.className = "0" + String(mwnu_num);tr.style.display = "none";
                    td.innerHTML = '<a href="#">' + json_data[i]["bill"] + '</a>';td.style.paddingLeft = "3%";
                    td1.innerHTML = "0" + String(mwnu_num) + "-" + String(menu_num);td1.style.paddingLeft = "3.5%";
                    td2.innerHTML = "有效";td2.style.textAlign = "center";
                    td3.innerHTML = '/';td3.style.textAlign = "center";td3.style.color = "#0c6fd9";td3.style.cursor = "pointer";
                    menu_num += 1
                } else {
                    tr.className = "0" + String(mwnu_num);tr.style.display = "none";
                    td.innerHTML = '<a href="#">' + json_data[i]["bill"] + '</a>';td.style.paddingLeft = "3%";
                    td1.innerHTML = "0" + String(mwnu_num) + "-" + String(menu_num);td1.style.paddingLeft = "3.5%";
                    td2.innerHTML = "有效";td2.style.textAlign = "center";
                    td3.innerHTML = '/';td3.style.textAlign = "center";td3.style.color = "#0c6fd9";td3.style.cursor = "pointer";
                    menu_num += 1
                }

                tr.appendChild(td);tr.appendChild(td1);tr.appendChild(td2);tr.appendChild(td3);t_table.appendChild(tr);
            }
        }

        // 删除列表
        function deltr() {
            var tb = document.getElementById('t_table');
            var rowNum = tb.rows.length;
            for (i = 0; i < rowNum; i++) {
                tb.deleteRow(i);
                rowNum = rowNum - 1;
                i = i - 1;
            }
        }

        // 删除列表
        function deltr1() {
            var tb = document.getElementById('t_table2');
            var rowNum = tb.rows.length;
            for (i = 0; i < rowNum; i++) {
                tb.deleteRow(i);
                rowNum = rowNum - 1;
                i = i - 1;
            }
        }

         // 删除列表
        function deltr2() {
            var tb = document.getElementById('t_table1');
            var rowNum = tb.rows.length;
            for (i = 0; i < rowNum; i++) {
                tb.deleteRow(i);
                rowNum = rowNum - 1;
                i = i - 1;
            }
        }

        // 选择委托人
        function choice_consignor(ele_id, chose_id, choice_key) {
            chose_id = 'executor2';
            if (chose_id === "executor2" || chose_id === "executor4") {
                var dataStr = sessionStorage.getItem(choice_key);
                var dataList = [];
                if (dataStr) {
                    sessionStorage.setItem(choice_key, dataStr + ", " + ele_id)
                } else {
                    sessionStorage.setItem(choice_key, ele_id)
                }

                if (chose_id === "executor2") {
                    var tag_id = "executor_str";
                } else {
                    tag_id = "executor_str1";
                }
                var executor_str = document.getElementById(tag_id);
                if (executor_str) {
                    if (document.getElementById(ele_id).checked) {
                        if (executor_str.innerText.trim()){
                            document.getElementById(tag_id).innerHTML = executor_str.innerText + ", " + ele_id;
                        }else {
                            document.getElementById(tag_id).innerHTML = ele_id;
                        }
                    } else {
                        var str_push = [];
                        var executor_list = executor_str.innerText.split(", ");
                        for (var kl = 0; kl < executor_list.length; kl++) {
                            if (executor_list[kl] !== ele_id) {
                                str_push.push(executor_list[kl])
                            }
                        }
                        document.getElementById(tag_id).innerHTML = str_push.join(", ")
                    }
                } else {
                    document.getElementById("checked-label").innerHTML = "<span id='" + tag_id + "' style='margin-left: 1%;width: 100%;'>" + ele_id + "</span>";
                }
            } else {
                check_more_one_not(ele_id);
                document.getElementById("checked-label").innerHTML = "<span id='" + tag_id + "' style='margin-left: 1%;'>" + ele_id + "</span>";
            }

        }

        // 复选框全选
        function check_all_select(choice_key, chose_id) {
            var select_check = document.getElementById("all_select_checkbox").checked;
            var all_check_box = document.getElementsByClassName("check_box");
            chose_id = 'executor2'
            if (chose_id === "executor2") {
                var tag_id = "executor_str";
            } else {
                tag_id = "executor_str1";
            }

            var executor_list = [];
            var executor_str = document.getElementById(tag_id);
            if (executor_str) {
                if (executor_str.innerText.trim()) {
                    executor_list = executor_str.innerText.split(", ")
                }
            }

            var new_check_val_list = [];
            var check_val_list = [];
            for (var HH = 0; HH < all_check_box.length; HH++) {
                all_check_box[HH].checked = true;
                check_val_list.push(all_check_box[HH].id);
                if (executor_list.lastIndexOf(all_check_box[HH].id) === -1) {
                    new_check_val_list.push(all_check_box[HH].id)
                }
            }

            if (select_check) {
                if (chose_id === "executor2" || chose_id === "executor4") {

                    if (executor_str) {
                        if (executor_str.innerText.trim()) {
                            document.getElementById(tag_id).innerHTML = executor_str.innerText + ", " + new_check_val_list.join(", ");
                        } else {
                            document.getElementById(tag_id).innerHTML = new_check_val_list.join(", ");
                        }

                    } else {
                        document.getElementById("checked-label").innerHTML = "<span id='" + tag_id + "' style='margin-left: 1%;width: 100%;'>" + check_val_list.join(", ") + "</span>";
                    }
                    sessionStorage.setItem(choice_key, "all" + ", " + check_val_list.join(", "))
                } else {
                    alert("该节点不能多选！");
                    document.getElementById("all_select_checkbox").checked = false;
                }
            } else {
                sessionStorage.removeItem(choice_key);
                check_val_list = [];
                for (var II = 0; II < all_check_box.length; II++) {
                    all_check_box[II].checked = false;
                    check_val_list.push(all_check_box[II].id);
                }
                var old_check_val = document.getElementById(tag_id).innerHTML.split(", ");
                console.log(old_check_val)
                for (var TB = 0; TB < check_val_list.length; TB++) {
                    removeByValue(old_check_val, check_val_list[TB])
                }

                document.getElementById(tag_id).innerHTML = old_check_val.join(", ");
            }
        };
        function removeByValue(arr, val) {
            for (var i = 0; i < arr.length; i++) {
                if (arr[i] === val) {
                    arr.splice(i, 1);
                    break;
                }
            }
        };


        // checkBox不允许多选
        function check_more_one_not(ele_id) {
            var check_box_list = document.getElementsByClassName("check_box");
            for (var i = 0; i < check_box_list.length; i++) {
                if (String(check_box_list[i].id) !== String(ele_id)) {
                    document.getElementById(check_box_list[i].id).checked = false;
                } else {
                    document.getElementById(check_box_list[i].id).checked = true;
                }
            }
        }

        // 选择执行人
        function summit_val(id) {
            var executor111 = '';
            var checked_label = document.getElementById("checked-label");
            for (var j = 0; j < checked_label.children.length; j++) {
                executor111 = executor111 + checked_label.children[j].innerText.trim() + ", ";
            }
            document.getElementById("close-model").click();
            var executor = executor111.slice(0, -2);
            var page = document.getElementsByClassName("active")[0].innerText;
            {#console.log(executor, page)#}
            document.getElementById("loading").style.display = "inline-block";
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP

            xhr.open('get', "/personal-center/bill_group_view?page=" + String(page)+ '&id=' + String(id) + '&executor=' + String(executor));
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
            xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
            xhr.send();
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        document.getElementById("loading").style.display = "none";
                        var JsonDate = JSON.parse(xhr.responseText);
                        create_table(JsonDate["count"], JsonDate["bill_groups"]);
                        create_table1(JsonDate["bill_groups"]);
                        pagenum(JsonDate["count"], page);
                    }
                }
            };

            {#document.getElementById(ele_id).innerHTML = executor111.slice(0, -2);#}

        }

        function summit_val1() {
            var executor111 = '';
            var checked_label = document.getElementById("checked-label");
            for (var j = 0; j < checked_label.children.length; j++) {
                executor111 = executor111 + checked_label.children[j].innerText.trim() + ", ";
            }
            document.getElementById("close-model").click();
            var executor = executor111.slice(0, -2);
            document.getElementById("zhixingren").value=executor;
        }

        // 加载分页条
        function pagenum(dataTotals = 1, page = 1) {
            new myPagination({
                id: 'pagination',
                curPage: page, //初始页码
                pageAmount: 20,  //每页多少条
                dataTotal: dataTotals, //总共多少条数据
                pageTotal: Math.ceil(parseInt(dataTotals, 10) / 20), //总页数
                pageSize: 5, //可选,分页个数
                showPageTotalFlag: true, //是否显示数据统计
                showSkipInputFlag: true, //是否支持跳转
                getPage: function (page) {
                    // var query_type = document.getElementById("query_type").value;
                    // var query_value = document.getElementById("query_value").value;
                    initialize(page);
                }
            });
        }

        function menu_contraction(contraction_num, Id_e) {
            var Issue_approval = document.getElementsByClassName(contraction_num);
            if (document.getElementById(Id_e).className === "iconfont icon-sanjiaoyou") {
                document.getElementById(Id_e).className = "iconfont icon-sanjiaoxia";
            } else {
                document.getElementById(Id_e).className = "iconfont icon-sanjiaoyou"
            }

            if (Issue_approval.length !== 0 && Issue_approval[0].style.display === "table-row") {
                for (var i = 0; i < Issue_approval.length; i++) {
                    Issue_approval[i].style.display = "none";
                }
            } else {
                for (var j = 0; j < Issue_approval.length; j++) {
                    Issue_approval[j].style.display = "table-row";
                }
            }

        }

        function change_left_val(ele_id) {
            if (ele_id === "an_rank") {
                document.getElementById("an_branch").style.color = "#0b0b0b";
                document.getElementById("an_func").style.color = "#0b0b0b";
                document.getElementById(ele_id).style.color = "#01aaed";
                deltr1();
                document.getElementById("img-display1").style.display = "inline-block";
                document.getElementById("department_list").innerHTML = "";
                var new_branch_list = ["书记、院长:A", "院领导:B", "职能科室负责人:C", "临床医技科室负责人:D", "副主任:G", "护士长:E","普通员工:F"];
                var new_department_list = document.getElementById("department_list");
                var new_ul_tag = document.createElement("ul");
                new_ul_tag.style.fontSize = "0";
                new_ul_tag.style.margin = "0";
                new_ul_tag.style.padding = "0";
                for (var EF = 0; EF < new_branch_list.length; EF++) {
                    var new_li_tag = document.createElement("li");
                    new_li_tag.style.fontSize = "14px";
                    new_li_tag.style.margin = "0";
                    new_li_tag.style.padding = "0";
                    new_li_tag.style.paddingLeft = "5%";
                    new_li_tag.innerHTML = "<p>" + new_branch_list[EF].split(":")[0] + "</p>";
                    new_li_tag.setAttribute("onclick", "choice_peopel_1('" + new_branch_list[EF].split(":")[1] + "')");
                    new_li_tag.setAttribute("id", new_branch_list[EF].split(":")[1]);
                    new_li_tag.className = "li-class";
                    new_ul_tag.appendChild(new_li_tag);
                    new_department_list.appendChild(new_ul_tag);
                }
            } else if (ele_id === 'an_func') {
                document.getElementById("an_branch").style.color = "#0b0b0b";
                document.getElementById("an_rank").style.color = "#0b0b0b";
                document.getElementById(ele_id).style.color = "#01aaed";
                deltr1();
                document.getElementById("img-display1").style.display = "inline-block";
                document.getElementById("department_list").innerHTML = "";
                var department_list_1 = document.getElementById("department_list");
                var ul_tag_1 = document.createElement("ul");
                ul_tag_1.style.fontSize = "0";
                ul_tag_1.style.margin = "0";
                ul_tag_1.style.padding = "0";
                var function_list = window.function_list;
                var func_list = [];
                for (var tt in function_list['function_dict']) {
                    func_list.push(tt);
                }
                console.log(func_list)
                for (var AB = 0; AB < func_list.length; AB++) {
                    var new_li_1 = document.createElement("li");
                    new_li_1.style.fontSize = "14px";
                    new_li_1.style.margin = "0";
                    new_li_1.style.padding = "0";
                    new_li_1.style.paddingLeft = "5%";
                    new_li_1.innerHTML = "<p>" + func_list[AB] + "</p>";
                    new_li_1.setAttribute("onclick", "choice_peopel_2('" + function_list['function_dict'][func_list[AB]] + "')");
                    new_li_1.setAttribute("id", function_list['function_dict'][func_list[AB]]);
                    new_li_1.className = "li-class";
                    ul_tag_1.appendChild(new_li_1);
                    department_list_1.appendChild(ul_tag_1);
                 }
            } else {
                document.getElementById("an_rank").style.color = "#0b0b0b";
                document.getElementById("an_func").style.color = "#0b0b0b";
                document.getElementById(ele_id).style.color = "#01aaed";
                deltr1();
                document.getElementById("img-display1").style.display = "inline-block";
                document.getElementById("department_list").innerHTML = "";
                var branch_list = window.branch_list;
                var department_list = document.getElementById("department_list");
                department_list.innerHTML = "";
                var ul_tag = document.createElement("ul");
                ul_tag.style.fontSize = "0";
                ul_tag.style.margin = "0";
                ul_tag.style.padding = "0";
                for (var i = 0; i < branch_list.length; i++) {
                    var li_tag = document.createElement("li");
                    li_tag.style.fontSize = "14px";
                    li_tag.style.margin = "0";
                    li_tag.style.padding = "0";
                    li_tag.innerHTML = "<p style='margin-left: 20%;'>" + branch_list[i] + "</p>";
                    li_tag.setAttribute("onclick", "choice_peopel('" + branch_list[i] + "')");
                    li_tag.setAttribute("id", branch_list[i]);
                    li_tag.className = "li-class";
                    ul_tag.appendChild(li_tag);
                    department_list.appendChild(ul_tag);
                }
            }
        }

        function search_data() {
            var searchData = document.getElementById("search_data").value;
            let emp_info_dict = window.emp_info_dict;
            var searchValNum = 1;
            var t_table = document.getElementById("t_table2");
            t_table.innerHTML = '';
            for (var i in emp_info_dict){
                for (var j = 0; j<emp_info_dict[i].length;j++){
                    if (emp_info_dict[i][j]['real_name'].indexOf(searchData) !== -1){
                        var elm = emp_info_dict[i];
                        var tr = document.createElement("tr");
                        var td = document.createElement("td");
                        var td1 = document.createElement("td");
                        var td2 = document.createElement("td");
                        var td3 = document.createElement("td");
                        td.innerHTML = "<input id='" + elm[j].real_name + "(" + elm[j].job_number + ')' + "' class='check_box' type=\"checkbox\" onclick='choice_consignor(this.id, \"" + i + "\")'>";
                        td.style.textAlign = "center";
                        td1.innerHTML = searchValNum;
                        td1.style.textAlign = "center";
                        td2.innerHTML = elm[j].real_name;
                        td2.title = elm[j].real_name;
                        td2.style.textAlign = "center";
                        td3.innerHTML = elm[j].job_number;
                        td3.title = elm[j].job_number;
                        td3.style.textAlign = "center";
                        tr.appendChild(td);
                        tr.appendChild(td1);
                        tr.appendChild(td2);
                        tr.appendChild(td3);
                        t_table.appendChild(tr);
                        searchValNum += 1;
                        document.getElementById("img-display1").style.display = "none";
                    }
                }
            }
        }

        function choose_val(val_data) {
			document.getElementById("chooseval").innerText=val_data;
		}

		function search_jurisdiction() {
            var chooseval = document.getElementById("chooseval").innerText;  // 单数赋值 下拉框的值
            var input_value = document.getElementById("input_value").value;     // 获取输入框的值
            document.getElementById("loading").style.display = "inline-block";
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP

            xhr.open('get', "/personal-center/bill_group_view?page=1&chooseval="+String(chooseval)+"&input_value="+String(input_value));
            {#xhr.open('get', "http://192.168.2.88:8000/personal-center/bill_group_view");#}
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
            xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
            xhr.send();
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        document.getElementById("loading").style.display = "none";
                        if (chooseval === "全部"){
                            document.getElementById("input_value").value = "";
                        }
                        var JsonDate = JSON.parse(xhr.responseText);
                        create_table(JsonDate["count"], JsonDate["bill_groups"]);
                        create_table1(JsonDate["bill_groups"]);
                        pagenum(JsonDate["count"], page);
                    }
                }
            };

        }

        function add_color(obj_id) {
            document.getElementById(obj_id).style.border="solid 1px #0c6fd9"
        }

        function del_color(obj_id) {
            document.getElementById(obj_id).style.border="solid 1px #efefef"
        }

        $('input:radio').click(function(){
            var $radio = $(this);
            if ($radio.data('checked')){
              $radio.prop('checked', false);
              $radio.data('checked', false);
            } else {
              $radio.prop('checked', true);
              $radio.data('checked', true);
            }
        });

        function add_big_limits_model(is_add=true, id=false) {
            alert(is_add)
            var menu = document.getElementById("caidan").value;           // 菜单
            var bill = document.getElementById("danju").value;             // 单据
            var input_radio_list = $('input:radio');
            var groups = [];                                    // 权限组列表
            for (var i=0; i<input_radio_list.length; i++){
                if (input_radio_list[i].checked){
                    groups.push(input_radio_list[i].name);
                }
            }
            var apply_user = document.getElementById("zhixingren").value;            // 执行人工号
            console.log(menu, bill, groups, apply_user)

            if (!menu){
                alert("请填写菜单名称！");
                return false;
            }else if (!bill){
                alert("请填写单据名称！");
                return false;
            }else if (!groups){
                alert("请选择权限组！");
                return false;
            }
            close_models();
            document.getElementById("loading").style.display = "inline-block";
            {#document.getElementById("close-add-limits").click();#}
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP
            if (is_add) {
                var form = new FormData();
                form.append("menu", String(menu));
                form.append("bill", String(bill));
                form.append("groups", groups);
                form.append("apply_user", String(apply_user));
                xhr.open('post', "/personal-center/bill_group_view", true);
                xhr.send(form);
                xhr.onreadystatechange = function () {
                    if (xhr.readyState === 4) {
                        if (xhr.status === 200) {
                            document.getElementById("loading").style.display = "none";
                            var JsonDate = JSON.parse(xhr.responseText);
                            console.log('JsonDate', JsonDate);
                            if (JsonDate['code'] !== 200){
                                alert(JsonDate['message'])
                            }else {
                                deltr();
                                deltr2();
                                create_table(JsonDate["count"], JsonDate["bill_groups"]);
                                create_table1(JsonDate["bill_groups"]);
                                pagenum(JsonDate["count"], 1);

                            }

                        }
                    }
                };
            }
            if (!is_add) {
                console.log('is_add', is_add);
                console.log('id', id);
                console.log("apply_user", apply_user)
                xhr.open('get', "/personal-center/bill_group_view?page=" + String(1)+ '&id=' + String(id) + '&executor=' + String(apply_user) + '&groups=' + String(groups));
                xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
                xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
                xhr.send();
                xhr.onreadystatechange = function () {
                    if (xhr.readyState === 4) {
                        if (xhr.status === 200) {
                            document.getElementById("loading").style.display = "none";
                            var JsonDate = JSON.parse(xhr.responseText);
                            deltr();
                            deltr2();
                            create_table(JsonDate["count"], JsonDate["bill_groups"]);
                            create_table1(JsonDate["bill_groups"]);
                            pagenum(JsonDate["count"], 1);
                        }
                    }
                };

            }


        }

        function padding_data(menu_name) {
            model_chuxian();
            document.getElementById("caidan").value=menu_name;
            document.getElementById("caidan").setAttribute("disabled", "true")
            document.getElementById("danju").removeAttribute("disabled")
            document.getElementById("zhixingren").value="";
            document.getElementById("danju").value="";
            document.getElementById("modal-title").innerText = "增加权限";
            document.getElementById("add_big_limits_model").setAttribute("onclick", "add_big_limits_model()")
            var input_radio_list = $('input:radio');
            for (var i=0; i<input_radio_list.length; i++){
                input_radio_list[i].checked = false
            }
        }

        function del_padding() {
            document.getElementById("modal-title").innerText = "增加权限";
            document.getElementById("caidan").value="";
            document.getElementById("zhixingren").value="";
            document.getElementById("caidan").removeAttribute("disabled")
            document.getElementById("danju").removeAttribute("disabled")
            document.getElementById("add_big_limits_model").setAttribute("onclick", "add_big_limits_model()")
            var input_radio_list = $('input:radio');
            for (var i=0; i<input_radio_list.length; i++){
                        input_radio_list[i].checked = false
            }
        }

        function padding_data1(menu_name, bill_name, groups, job_numbers) {
            document.getElementById("caidan").value=menu_name;
            document.getElementById("caidan").setAttribute("disabled", "true");
            document.getElementById("danju").value=bill_name;
            document.getElementById("danju").setAttribute("disabled", "true")
            document.getElementById("zhixingren").value=job_numbers;

            groups = groups.split(", ")
            {#console.log('groups', groups)#}

            var input_radio_list = $('input:radio');
            {#alert(input_radio_list)#}
            {#var groups = [];                                    // 权限组列表#}
            for (var i=0; i<input_radio_list.length; i++){
               {#alert(input_radio_list[i].name)#}
                    var a = groups.indexOf(input_radio_list[i].name)
                    if(a > -1){
                        input_radio_list[i].checked = true
                    }else{
                        input_radio_list[i].checked = false
                    }
            }

        };



        var box = document.getElementById('box');
        var isDown = false;
        var mouse = {};
        box.onmousedown = (e) => {
            isDown = true;
            isDown_1 = false;
            //保存初始位置
            mouse = {
                startX: e.clientX,
                startY: e.clientY,
                offsetLeft: box.offsetLeft,
                offsetTop: box.offsetTop,
            }
        };

        box.onmousemove = (e) => {
            if (!isDown) {
                return
            }
            //计算偏移位置
            var offsetLeft = mouse.offsetLeft + e.clientX - mouse.startX;
            var offsetTop = mouse.offsetTop + e.clientY - mouse.startY;

            //设置偏移距离的范围[0,window.innerWidth - 400]
            offsetLeft = Math.max(0, Math.min(offsetLeft, window.innerWidth - 400));
            offsetTop = Math.max(0, Math.min(offsetTop, window.innerHeight - 400));

            box.style.left = offsetLeft + 'px';
            box.style.top = offsetTop + 'px';

        };
        //当鼠标滑的太快时，容易移出box，所以在window上监听此事件
        window.onmouseup = () => {
            isDown = false;
            box.style.cursor = 'default';
            mouse = null;
        };

        function close_models() {
            document.getElementById("new_models").style.display="none";
        }


    </script>
{% endblock %}
